<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="/static/css/buttons.css"/>
    <link rel="stylesheet" href="/static/css/bootstrap.mini.css">
</head>
<body>
    <table class="table table-striped table-bordered table-hover">
      <tr>
        <th>ID</th>
        <th>主机IP</th>
        <th>域名</th>
        <th>服务名</th>
        <th>版本</th>
        <th>启动操作</th>
        <th>发布操作</th>
      </tr>
        {% for server in servers %}
      <tr>
          <td id="server_id">{{ server.id }}</td>
          <td>{{ server.host.ip }}</td>
          <td>{{ server.domain.domain }}</td>
          <td>{{ server.server.name }}</td>
          <td>{{ server.version.code }}</td>
          <td>
              <span class="button-dropdown" data-buttons="dropdown">
                <button class="button button-rounded">
                  选项 <i class="fa fa-caret-down"></i>
                </button>

                <ul class="button-dropdown-list">
                  <li><a href="javascript:void(0);" onclick="handle_server({{ server.id }},100)">启动</a></li>
                  <li><a href="javascript:void(0);" onclick="handle_server({{ server.id }},101)">停止</a></li>
                  <li><a href="javascript:void(0);" onclick="handle_server({{ server.id }},102)">重启</a></li>

                </ul>
              </span>
          </td>
          <td>
              <span class="button-dropdown" data-buttons="dropdown">
                <button class="button button-rounded">
                  选项 <i class="fa fa-caret-down"></i>
                </button>


                <ul class="button-dropdown-list">
                  <li><a href="#">更新</a></li>
                  <li><a href="#">回滚</a></li>
                  <li><a href="#">检测</a></li>


                </ul>
              </span>
          </td>
      </tr>
        {% endfor %}
</table>
    <script rel="script" src="/static/js/jquery.min.js"></script>
    <script rel="script" src="/static/js/buttons.js"></script>
    <script>
        function handle_server(num,handle){
            console.log(num);
            console.log(handle);
            $.ajax({
                url:'/api/handle_server/',
                type:'POST',
                data:{'server_id':num,
                    "handle":handle
                    },
                success:function(arg){
                    console.log("handle success")

                },
                error:function(){
                    console.log('handle failed')
                }
            });

        }
    </script>
</body>
</html>